<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

<style type="text/css">
    .triangle{
        width:0px;
        height:0px;
        border-right:6px solid transparent;
        border-left:6px solid transparent;
        border-bottom:6px solid #0984e3;

    }
    .line{
        border-bottom:2px solid #0984e3;
    }
</style>

<body>

<div style="width: 93%;margin-left: 30px;padding-bottom: 20px">
    <div class="row">
        <div>
            <span style="font-size: 25px; color: #0984e3 ">设置绑定同步</span>
        </div>
        <div class="triangle" style="margin-left: 20px"></div>
        <div class="line"></div>
    </div>

    <div class="row" style="margin-top: 10px ">
        <div style="width: 100%; height: 110px; padding: 10px 30px 0px 20px; margin-bottom: 30px; background-color: #ffffff;
                 -moz-box-shadow: 0px 0px 1px  #909090;-webkit-box-shadow: 0px 0px 1px  #909090;">
            <div style="width: 18%; float: left;padding-top: 30px">
                <span class="glyphicon glyphicon-ok-circle" style="color: #78e08f; font-size: 18px"></span>
                <span style="font-size: 20px">登录密码</span>
            </div>
            <div style="width: 15%; float: left;padding-top: 35px">
                <span style="font-size: 15px">建议定期更换</span>
            </div>
            <div style="width: 50%; float: left;padding-top: 28px">
                <span style="font-size: 12px; color: #747d8c">安全性高的密码可以使账号更安全。建议您定期更换密码，且设置一个包含数字和字母，并且长度超过8位以上的密码。</span>
            </div>
            <div style="width: 17%;float: left;text-align: right;padding-top: 32px;">
                <a href="#">
                    <span  style="font-size: 13px;">修改</span>
                </a>
            </div>
        </div>
        <div style="width: 100%; height: 110px; padding: 10px 30px 0px 20px; margin-bottom: 30px; background-color: #ffffff;
                 -moz-box-shadow: 0px 0px 1px  #909090;-webkit-box-shadow: 0px 0px 1px  #909090;">
            <div style="width: 18%; float: left;padding-top: 30px">
                <span class="glyphicon glyphicon-ok-circle" style="color: #78e08f; font-size: 18px"></span>
                <span style="font-size: 20px">绑定手机</span>
            </div>
            <div style="width: 15%; float: left;padding-top: 35px">
                <span style="font-size: 15px">+86-135****2143</span>
            </div>
            <div style="width: 50%; float: left;padding-top: 28px">
                <span style="font-size: 12px; color: #747d8c">绑定手机后，您即可享受手机号登录、动态码登录、找回密码等。为了帐号安全，建议您在更换手机号后第一时间更换绑定手机。</span>
            </div>
            <div style="width: 17%;float: left;text-align: right;padding-top: 32px;">
                <a href="#">
                    <span  style="font-size: 13px;">修改</span>
                </a>
                &nbsp;
                <a href="#">
                    <span  style="font-size: 13px;">解除绑定</span>
                </a>
            </div>
        </div>
        <div style="width: 100%; height: 110px; padding: 10px 30px 0px 20px; margin-bottom: 30px; background-color: #ffffff;
                 -moz-box-shadow: 0px 0px 1px  #909090;-webkit-box-shadow: 0px 0px 1px  #909090;">
            <div style="width: 18%; float: left;padding-top: 30px">
                <span class="glyphicon glyphicon-exclamation-sign" style="color: #ffa502; font-size: 18px"></span>
                <span style="font-size: 20px">绑定邮箱</span>
            </div>
            <div style="width: 15%; float: left;padding-top: 35px">
                <span style="font-size: 15px"></span>
            </div>
            <div style="width: 50%; float: left;padding-top: 28px">
                <span style="font-size: 12px; color: #747d8c">绑定E-mail后，您即可使用E-mail登录携程或找回密码等。</span>
            </div>
            <div style="width: 17%;float: left;text-align: right;padding-top: 32px;">
                <a href="#">
                    <span  style="font-size: 13px;">设置绑定邮箱</span>
                </a>
            </div>
        </div>
    </div>

</div>


</body>
</html>